$(function () {
    page();
    load();
})

function page() {
    $("#tab_data").bootstrapTable({
        //请求方式  get请求中文会乱码，建议使用post请求
        method: 'post',
        //请求头部的设置
        contentType: 'application/json',
        //url
        url: '/Role.do/Page',
        //设置交替行样式
        striped: true,
        //初始显示页号
        pageNumber: 1,
        //设置表格高度
        //height: 350,
        //是否显示分页
        pagination: true,
        //设置是服务端分页还是客户端分页
        sidePagination: 'server',
        //页大小
        pageSize: 5,
        //分页列表
        pageList: [3, 5, 6, 10],
        //上传到服务端的参数
        queryParams: function (params) {
            let rolename = $("#rolename").val();
            console.log(rolename)
            return {
                num: params.offset / params.limit + 1,
                size: params.limit,
                obj: {rolename: rolename}
            }
        },
        // 定义列名
        columns: [
            {
                title: "<input type='checkbox' id='checkbox' />", field: "roleid", align: "center",
                formatter: function (vale, row, index) {
                    let img = "<input style='width: 25px;height: 25px;' type='checkbox' name='roleid' value='" + vale + "'/>";
                    return img
                }
            },
            {title: "角色编号", field: "roleid", align: "center"},
            {title: "角色名称", field: "rolename", align: "center"},
            {title: "角色的父级ID", field: "parentid", align: "center"},
            {title: "角色描述", field: "describe", align: "center"},
            {
                title: "角色状态", field: "status", align: "center",
                formatter: function (vale, row, index) {
                    return vale == 0 ? "正常" : "禁用"
                }
            },
            {
                title: "操作", field: "roleid", align: "center",
                formatter: function (vale, row, index) {
                    let role = JSON.stringify(row);
                    let up_btn = "  <button class=\"btn btn-primary\"  data-toggle=\"modal\" data-target=\"#exampleModal\" onclick='update(" + role + ")'>修改</button>";
                    let del_btn = "  <button class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#delModal\"  onclick=\"LoadRoleDel('" + vale + "')\">删除</button>";

                    return up_btn + "" + del_btn
                }
            }
        ]
    })
    load();
}

function LoadRoleAdd() {
    //重置表单
    $("#AddUpDate")[0].reset();
    $("[name='YCid']").prop("hidden", true);

    $.post("/Role.do/list", function (data) {
        let str = "<option value=\"-1\" >--请选择--</option>";
        $.each(data, function (index, item) {
            str += " <option value=\"" + item.roleid + "\" >--" + item.rolename + "--</option>"
        })
        $("[name='parentid']").html(str);
    })
    $("[name='describe']").text(null);

    $("#exampleModalLabel").text("添加角色信息")
    $("#AddUpDate").prop("action", "/Role.do/Add?auths=addrole");
    submitForm();
}

function update(role) {
    //重置表单
    $("#AddUpDate")[0].reset();
    $("[name='YCid']").prop("hidden", false);

    $.each(role, function (key, value) {
        $("input[name=" + key + "]").val(value);
    })
    $.post("/Role.do/list", function (data) {
        console.log(data)
        let str = "<option value=\"-1\" >--请选择--</option>";
        $.each(data, function (index, item) {
            str += " <option " + (item.roleid == role.parentid ? 'selected' : '') + " value=\"" + item.roleid + "\" >--" + item.rolename + "--</option>"
        })
        $("[name='parentid']").html(str);
    })
    $("[name='describe']").text(role.describe);
    let s = " <input type=\"radio\" " + (role.status == 0 ? 'checked' : '') + " name=\"status\" value='0' style=\"width: 16px;height: 16px;\"/>&nbsp;\n" +
        "      <strong>正常</strong> &nbsp;&nbsp;\n" +
        "      <input type=\"radio\" " + (role.status == 1 ? 'checked' : '') + "  name=\"status\" value='1'  style=\"width: 16px;height: 16px;\"/>&nbsp;\n" +
        "       <strong>禁用</strong>";
    $("#status").html(s);

    $("#exampleModalLabel").text("修改角色信息")
    $("#AddUpDate").prop("action", "/Role.do/UpDate?auths=updaterole");
    submitForm();
}

function LoadRoleDel(id) {
    $("#delModal").modal("show");
    $("#delSubmit").one("click", function () {
        $.post("/Role.do/Delete?auths=delrole", {id: id}, function (data) {
            $("#delModal").modal("hide");
            $("#tab_data").bootstrapTable("refresh")
        })
    })
}

function rolemenu() {
    //重置表单
    $("#AccRole")[0].reset();
    $("#AM").html(null);

    var j = $("[name='roleid']:checkbox:checked");
    if (j.length == 0 || j.length > 1) {
        alert("请选择一个账号设置角色！");
        location.href = "/role/Role.html";
    } else {
        var id = j[0].value;
        localStorage.setItem("UpRoleId", id);
        location.href = "/role/RoleMenu.html";
    }
}

function roleauth() {
    //重置表单
    $("#AccRole")[0].reset();
    $("#AM").html(null);

    var j = $("[name='roleid']:checkbox:checked");
    if (j.length == 0 || j.length > 1) {
        alert("请选择一个账号设置角色！");
        location.href = "/role/Role.html";
    } else {
        var id = j[0].value;
        $.post("/Roleauthorization.do/RoleAuthAll", {roleid: id}, function (sdata) {
            console.log(sdata);
            $("[name='roleid']").val(id);
            $("[name='rolename']").val(id);
            let str = "";
            $.each(sdata, function (index, item) {
                str += "<div class='row'><div class='col'>" +
                    " <input style='width: 25px;height: 25px;' type=\"checkbox\" " + (item.tf == true ? 'checked' : '') + " id=\"checkbox\" value='" + item.auid + "' name=\"auid\">&nbsp;\n" +
                    " <input type=\"button\" id=\"button\" class=\"btn btn-secondary\" value=\"" + item.auname + "\" >" +
                    "</div></div>";
            });
            $("#AM").html(str);
        })
        $("#AccRoleModal").modal("show");
    }

    submit("授予/收回角色权限", "选择权限", "/Roleauthorization.do/DelAdd?auths=RoleAuth");
}

function submit(name1, name2, url) {
    $("#rname").text(name1);
    $("#AMname").text(name2);
    $("#btn").on("click", function () {
        $.ajax({
            type: "post",
            url: url,
            data: $("#AccRole").serialize(),
            success: function (data) {
                $("#AccRoleModal").modal("hide");
            }
        })
    })
    load();
}

// 刷新页面
function submitForm() {
    $("#exampleModal").modal("hide");
    $("#tab_data").bootstrapTable("refresh")
    $("#exampleModal").modal("show");
}

function load() {
    $("#tab_data").bootstrapTable("refresh")
}
